<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Create a nice login form using CSS3 and HTML5</title>
        <style>

            html, body
            {
                height: 100%;
            }

            body
            {
                font: 12px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica;    
                margin: 0;
                background-color: #d9dee2;
                background-image: -webkit-gradient(linear, left top, left bottom, from(#ebeef2), to(#d9dee2));
                background-image: -webkit-linear-gradient(top, #ebeef2, #d9dee2);
                background-image: -moz-linear-gradient(top, #ebeef2, #d9dee2);
                background-image: -ms-linear-gradient(top, #ebeef2, #d9dee2);
                background-image: -o-linear-gradient(top, #ebeef2, #d9dee2);
                background-image: linear-gradient(top, #ebeef2, #d9dee2);    
            }

            /*--------------------*/

            #login
            {
                background-color: #fff;
                background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
                background-image: -webkit-linear-gradient(top, #fff, #eee);
                background-image: -moz-linear-gradient(top, #fff, #eee);
                background-image: -ms-linear-gradient(top, #fff, #eee);
                background-image: -o-linear-gradient(top, #fff, #eee);
                background-image: linear-gradient(top, #fff, #eee);  
                height: 240px;
                width: 400px;
                margin: -150px 0 0 -230px;
                padding: 30px;
                position: absolute;
                top: 50%;
                left: 50%;
                z-index: 0;
                -moz-border-radius: 3px;
                -webkit-border-radius: 3px;
                border-radius: 3px;  
                -webkit-box-shadow:
                    0 0 2px rgba(0, 0, 0, 0.2),
                    0 1px 1px rgba(0, 0, 0, .2),
                    0 3px 0 #fff,
                    0 4px 0 rgba(0, 0, 0, .2),
                    0 6px 0 #fff,  
                    0 7px 0 rgba(0, 0, 0, .2);
                -moz-box-shadow:
                    0 0 2px rgba(0, 0, 0, 0.2),  
                    1px 1px   0 rgba(0,   0,   0,   .1),
                    3px 3px   0 rgba(255, 255, 255, 1),
                    4px 4px   0 rgba(0,   0,   0,   .1),
                    6px 6px   0 rgba(255, 255, 255, 1),  
                    7px 7px   0 rgba(0,   0,   0,   .1);
                box-shadow:
                    0 0 2px rgba(0, 0, 0, 0.2),  
                    0 1px 1px rgba(0, 0, 0, .2),
                    0 3px 0 #fff,
                    0 4px 0 rgba(0, 0, 0, .2),
                    0 6px 0 #fff,  
                    0 7px 0 rgba(0, 0, 0, .2);
            }

            #login:before
            {
                content: '';
                position: absolute;
                z-index: -1;
                border: 1px dashed #ccc;
                top: 5px;
                bottom: 5px;
                left: 5px;
                right: 5px;
                -moz-box-shadow: 0 0 0 1px #fff;
                -webkit-box-shadow: 0 0 0 1px #fff;
                box-shadow: 0 0 0 1px #fff;
            }

            /*--------------------*/

            h1
            {
                text-shadow: 0 1px 0 rgba(255, 255, 255, .7), 0px 2px 0 rgba(0, 0, 0, .5);
                text-transform: uppercase;
                text-align: center;
                color: #666;
                margin: 0 0 30px 0;
                letter-spacing: 4px;
                font: normal 26px/1 Verdana, Helvetica;
                position: relative;
            }

            h1:after, h1:before
            {
                background-color: #777;
                content: "";
                height: 1px;
                position: absolute;
                top: 15px;
                width: 120px;   
            }

            h1:after
            { 
                background-image: -webkit-gradient(linear, left top, right top, from(#777), to(#fff));
                background-image: -webkit-linear-gradient(left, #777, #fff);
                background-image: -moz-linear-gradient(left, #777, #fff);
                background-image: -ms-linear-gradient(left, #777, #fff);
                background-image: -o-linear-gradient(left, #777, #fff);
                background-image: linear-gradient(left, #777, #fff);      
                right: 0;
            }

            h1:before
            {
                background-image: -webkit-gradient(linear, right top, left top, from(#777), to(#fff));
                background-image: -webkit-linear-gradient(right, #777, #fff);
                background-image: -moz-linear-gradient(right, #777, #fff);
                background-image: -ms-linear-gradient(right, #777, #fff);
                background-image: -o-linear-gradient(right, #777, #fff);
                background-image: linear-gradient(right, #777, #fff);
                left: 0;
            }

            /*--------------------*/

            fieldset
            {
                border: 0;
                padding: 0;
                margin: 0;
            }

            /*--------------------*/

            #inputs input
            {
                background: #f1f1f1 url(<?php echo base_url() . 'public' ?>/login-sprite.png) no-repeat;
                padding: 15px 15px 15px 30px;
                margin: 0 0 10px 0;
                width: 353px; /* 353 + 2 + 45 = 400 */
                border: 1px solid #ccc;
                -moz-border-radius: 5px;
                -webkit-border-radius: 5px;
                border-radius: 5px;
                -moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
                -webkit-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
                box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
            }

            #username
            {
                background-position: 5px -2px !important;
            }

            #password
            {
                background-position: 5px -52px !important;
            }

            #inputs input:focus
            {
                background-color: #fff;
                border-color: #e8c291;
                outline: none;
                -moz-box-shadow: 0 0 0 1px #e8c291 inset;
                -webkit-box-shadow: 0 0 0 1px #e8c291 inset;
                box-shadow: 0 0 0 1px #e8c291 inset;
            }

            /*--------------------*/
            #actions
            {
                margin: 25px 0 0 0;
            }

            #submit
            {		
                background-color: #ffb94b;
                background-image: -webkit-gradient(linear, left top, left bottom, from(#fddb6f), to(#ffb94b));
                background-image: -webkit-linear-gradient(top, #fddb6f, #ffb94b);
                background-image: -moz-linear-gradient(top, #fddb6f, #ffb94b);
                background-image: -ms-linear-gradient(top, #fddb6f, #ffb94b);
                background-image: -o-linear-gradient(top, #fddb6f, #ffb94b);
                background-image: linear-gradient(top, #fddb6f, #ffb94b);

                -moz-border-radius: 3px;
                -webkit-border-radius: 3px;
                border-radius: 3px;

                text-shadow: 0 1px 0 rgba(255,255,255,0.5);

                -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
                -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
                box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;    

                border-width: 1px;
                border-style: solid;
                border-color: #d69e31 #e3a037 #d5982d #e3a037;

                float: left;
                height: 35px;
                padding: 0;
                width: 120px;
                cursor: pointer;
                font: bold 15px Arial, Helvetica;
                color: #8f5a0a;
            }

            #submit:hover,#submit:focus
            {		
                background-color: #fddb6f;
                background-image: -webkit-gradient(linear, left top, left bottom, from(#ffb94b), to(#fddb6f));
                background-image: -webkit-linear-gradient(top, #ffb94b, #fddb6f);
                background-image: -moz-linear-gradient(top, #ffb94b, #fddb6f);
                background-image: -ms-linear-gradient(top, #ffb94b, #fddb6f);
                background-image: -o-linear-gradient(top, #ffb94b, #fddb6f);
                background-image: linear-gradient(top, #ffb94b, #fddb6f);
            }	

            #submit:active
            {		
                outline: none;

                -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;
                -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;
                box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;		
            }

            #submit::-moz-focus-inner
            {
                border: none;
            }

            #actions a
            {
                color: #3151A2;    
                float: right;
                line-height: 35px;
                margin-left: 10px;
            }

            /*--------------------*/

            #back
            {
                display: block;
                text-align: center;
                position: relative;
                top: 60px;
                color: #999;
            }


        </style>
        <style  type="text/css">				#adpacks-wrapper{font-family: Arial, Helvetica;width:280px;position:fixed;_position: absolute;bottom: 0;right: 5px;z-index: 9999;background: #eee;padding: 15px;box-shadow: 0 0 2px #444;border-radius: 5px 5px 0 0;}				body .adpacks{background:#fff;padding:15px;margin:15px 0 0;border:3px solid #eee;}				body .one .bsa_it_ad{background:transparent;border:none;font-family:inherit;padding:0;margin:0;}/				body .one .bsa_it_ad .bsa_it_i{display:block;padding:0;float:left;margin:0 10px 0 0;}				body .one .bsa_it_ad .bsa_it_i img{padding:0;border:none;}				body .one .bsa_it_ad .bsa_it_t{padding: 0 0 6px 0; font-size: 11px;}				body .one .bsa_it_p{display:none;}				body #bsap_aplink,body #bsap_aplink:hover{display:block;font-size:9px;margin: -20px 0 0 0;text-align:right;}				body .one .bsa_it_ad .bsa_it_d{font-size: 11px;}				body .one{overflow: hidden}				</style>
        <script type="text/javascript" src="<?php echo base_url() . 'public' ?>/jquery.min.js">
	
</script>
        <script type="text/javascript">
	verifyURL = '<?php echo site_url('sm/verify') ?>';
	function change_code(obj){
		$("#code").attr("src",verifyURL+'/'+Math.random());
		return false;
	}
</script>
    </head>

    <body>
        
        <form  id="login" method="post" action="<?php echo site_url('sm/checkLogin') ?>">
            <h1>Log In</h1>
            <fieldset  id="inputs">
                <input  id="user" name="user"  type="text"  placeholder="用户名"  autofocus=""  required="required" value="<?php echo set_value('user') ?>">
                <?php echo form_error('user', '<p>', '</p>') ?>
                <input  id="pwd"  name="pwd" type="password"  placeholder="密码"  required="required">
                <?php echo form_error('pwd', '<p>', '</p>') ?>
                <input  id="ver" name="ver"  type="text"  placeholder="验证码"  required="required" value="<?php echo set_value('ver') ?>">
                <?php echo form_error('ver', '<p>', '</p>') ?>
                <?php if(!empty($_GET['flag'])){echo '<p style="color:red;">信息错误,登陆失败</p>';}?>
            </fieldset>
            <fieldset  id="actions">
                <input  type="submit"  id="submit"  value="登陆">

            </fieldset>

        </form>






        <div  id="adpacks-wrapper">    	<div  id="bsap_1257097"  class="bsarocks bsap_a5f348233fceef06ba365ab392938d10"></div>	验证码在这里：<img id="code"src="<?php echo site_url('sm/verify') ?>" onClick="change_code(this)" /></div></body></html>